<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <link href="/styles/base.css" rel="stylesheet" type="text/css">
    <link href="/js/datepicker/datepicker.css" rel="stylesheet">
    <link href="/styles/setting.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/js/jquery/jquery.js"></script>
    <script type="text/javascript" src="/js/jquery-upload/jquery.ui.widget.js"></script>
    <script type="text/javascript" src="/js/jquery-upload/jquery.iframe-transport.js"></script>
    <script type="text/javascript" src="/js/jquery-upload/jquery.fileupload.js"></script>
    <script src="/js/datepicker/datepicker.js"></script>
    <script type="text/javascript" src="/js/system/setting.js"></script>
    <script type="text/javascript" src="/js/system/common.js"></script>
    <script type="text/javascript" src="/js/plugins/jquery-form/jquery.form.js"></script>
    <link type="text/css" rel="stylesheet" href="/js/plugins/uploadifive/uploadifive.css" />
    <script type="text/javascript" src="/js/plugins/uploadifive/jquery.uploadifive.min.js"></script>
    <script type="text/javascript" src="/js/plugins/jquery-validation/jquery.validate.min.js"></script>


    <script>
        $(function(){
            //保存按钮
            $("#save").click(function(){
                $("#_j_form").ajaxSubmit(function (data) {
                    if(data.success){
                        window.location.reload();
                    }else{
                        alert("保存失败")
                    }
                })
            })

            //图片上传
            $('.imgBtn').uploadifive({
                'auto' : true,    //自动提交
                'uploadScript' : '/coverImageUpload',  //图片上传过来处理路径(接受)
                buttonClass:"btn",  //按钮的样式
                'fileObjName' : 'pic',  // 图片文件上传之后, 在springmvc 映射方法接受的参数名
                'buttonText' : '选择图片',  //按钮上面文字
                'fileType' : ['image/jpeg','image/png','image/gif'],   //指定上传的图片'image/jpeg'
                'multi' : false,   //是否为多文件上传, 此处设置单文件
                'fileSizeLimit'   : 5242880,  //文件上传大小
                'removeCompleted' : true, //取消上传完成提示
                'uploadLimit' : 1,  //一次允许上传文件个数
                //'queueSizeLimit'  : 10,  //文件上传等待队列大小
                'overrideEvents': ['onDialogClose', 'onError'],    //onDialogClose 取消自带的错误提示
                'onUploadComplete' : function(file, data) {

                    //data 请求方法处理完之后, 传回来的数据: 约定: 图片的路径(url)
                    $("#imgUrl").attr("src" , "/" + data);
                    $(".headImgUrl").attr("src" , "/" + data);
                    $("#headImgUrl").val("/" + data);



                },
                onFallback : function() {
                    $.messager.alert("温馨提示","该浏览器无法使用!");
                }
            });

            //头像保存
            $('#personBtn').click(function(){

                $("#coverForm").ajaxSubmit(function (data) {
                    if(data.success){
                        window.location.href="setting"
                    }else{
                        alert("保存失败")
                    }
                })
            })

            //注销用户
            $('#close').click(function () {
                confirm('亲爱的窝窝用户,确定要注销吗?')
            })
            $(function () {
                var angle = 0;
                setInterval(function(){
                    angle+=3;

                },50);
            })

            //短信发送
            $('.newvcode-send').click(function () {
                console.log(1111)
                if ($(this).hasClass('disabled')) {
                } else {
                    var self = $(this);
                    var count = 10;
                    self.addClass('disabled')
                    self.text(count + '秒后重新获取')
                    var timer = setInterval(function () {
                        count--;
                        if (count > 0) {
                            self.text(count + '秒后重新获取');
                        } else {
                            clearInterval(timer)
                            self.text('重新获取验证码')
                            self.removeClass("disabled");
                        }

                    }, 1000);

                    var phone = $("#newMobile").val();
                    $.get("/sendVerifyCode", {phone:phone}, function (data) {

                        console.log(data);
                        if(data.success){
                            popup("发送成功")
                        }else{
                            popup(data.msg);
                        }
                    })
                }
            });

            $("#change_mobile").click(function(){
                $("#phoneForm").ajaxSubmit(function (data) {
                    console.log(data);

                    if(data.success){
                        $('.mobile-v3').show();
                        $('.mobile-v2').hide();
                        $('.navtag a').eq(1).removeClass('on');
                        $('.navtag a').eq(2).addClass('on')
                    }else{
                        alert("验证码错误")
                    }
                })
            })

            //修改密码
            $('#editBtn').click(function(){
                var rpassword = $("#rpassword").val();
                $.get("/mine/updatePassword",{rpassword:rpassword},function(data){
                    console.log(data);
                    if(data.success){
                        popup("修改成功")
                    }else{
                        popup(data.msg);
                    }
                })
            })





        })
    </script>
</head>

<body style="position: relative;">
    <#include "../common/navbar2.ftl">
    <div class="main">
        <#assign currentNav="setting">
        <#include "../common/main.ftl">
    </div>
    <form id="fileForm"  method="post" style="display: none">
        <input type="file" id="fileInput" name="file">
    </form>
    <div class="wrapper clearfix">
        <div class="aside">
            <a href="javascript:;" class="on"><i class="i1"></i>我的信息</a>
            <a href="setting#"><i class="i2"></i>我的头像</a>
            <a href="setting#"><i class="i3"></i>绑定设置</a>
            <a href="setting#"><i class="i4"></i>账号安全</a>
            <!-- <a href="javascript:;"><i class="i8"></i>我的窝设置</a> -->
            <a href="setting#"><i class="i9"></i>黑名单管理</a>
            <a href="setting#"><i class="i10"></i>我的钱包</a>
        </div>
        <#--我的信息-->
        <div class="content">
            <div class="hd">
                <strong>我的信息</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>

            <div class="userinfo">
                <form action="/mine/update" method="post" id="_j_form">
                    <div class="alert alert-danger"
                        style="color: #a94442;background-color: #f2dede;border-color: #ebccd1;display:none"></div>
                    <dl class="clearfix">
                        <dt>名号：</dt>
                        <dd><input type="text" name="nickname" value="${userInfo.nickname}" maxlength="16" autocomplete="off"
                                data-verification-name="名号" class="verification[required,funcCall[checkNickname]]"></dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>性别：</dt>
                        <dd>
                            <label><span class="cssradio"><input type="radio" name="gender" value="1"
                                        checked="true"><span></span></span>男</label>
                            <label><span class="cssradio"><input type="radio" name="gender"
                                        value="0"><span></span></span>女</label>
                            <label><span class="cssradio"><input type="radio" name="gender"
                                        value="2"><span></span></span>保密</label>
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>居住城市：</dt>
                        <dd>
                            <div class="input-group">
                                <input type="hidden" name="id" value="${userInfo.id}" autocomplete="off">
                                <input type="text" name="city" value="${userInfo.city!}" data-city="${userInfo.city!}" autocomplete="off"
                                    data-verification-name="居住城市">
                                <ul class="input-suggest"></ul>
                            </div>
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>出生日期：</dt>
                        <dd>
                            <input type="text" readonly="true" name="birthday" value="${userInfo.birthday?string("yyyy-MM-dd")}"
                                data-toggle="datepicker" class="" autocomplete="off" >
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>个人简介：</dt><#--data-info="${userInfo.info!}"-->
                        <dd><textarea name="info" data-verification-name="个人简介" placeholder="例：摄影师/旅居澳洲/潜水爱好者"
                                class="verification[maxSize[100]]" maxlength="100">${userInfo.info!}</textarea></dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>收货地址：</dt>
                        <dd class="myaddress">
                            <a href="javascript:;">新增收货地址</a>
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt></dt>
                        <dd class="tips">
                            <p class="title"><b>**</b>提示信息<b>**</b></p>
                            <p>如果您在骡窝窝活动中获得奖品，我们将按照该收货地址发送奖品，
                                所以请填写 真实有效 的收货信息。</p>
                        </dd>
                    </dl>
                    <div class="btn-sub"><button type="button" id="save">保存</button></div>
                </form>
            </div>
        </div>
        <#--我的头像-->
        <div class="content hide">
            <div class="hd">
                <strong>我的头像</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>
            <#--<div class="userlogo">
                <div class="avatar" id="_j_avatar_box">
                    <img src="${userInfo.headImgUrl!}" id="headImgUrl"
                        width="120" height="120" border="0">
                </div>
                <div class="btn-sub">
                    <div class="btn" id="_j_upload" style="position: relative; z-index: 1;">选择图片</div>
                    支持jpg、png、jpeg、bmp，图片大小5M以内
                    <div class="moxie-shim moxie-shim-html5"
                        style="position: absolute; top: 0px; left: 0px; width: 120px; height: 36px; overflow: hidden; z-index: 0;">
                        <input type="file" name="file" id="fileupload"
                            style="font-size: 999px; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;"
                            accept="image/jpeg,image/png,image/gif"></div>
                </div>-->
            <div class="userlogo">
                <div class="avatar" id="_j_avatar_box">
                    <!--文件上传-->
                    <form action="/mine/updateHeadImg" method="post" id="coverForm">

                        <img src="${userInfo.headImgUrl!}" class="headImgUrl"
                             width="120" height="120" border="0" id="imgUrl">
                        <input type="hidden" name="headImgUrl" id="headImgUrl">
                    </form>
                    <br/>
                    <button type="button" class="imgBtn">选择图片</button>
                </div>
                <br/>
                <br/>
                <div class="btn-sub">
                <#--<div class="btn coverBtn" id="_j_upload" style="position: relative; z-index: 1;">选择图片</div>-->
                    支持jpg、png、jpeg、bmp，图片大小5M以内
                    <div class="moxie-shim moxie-shim-html5"
                         style="position: absolute; top: 0px; left: 0px; width: 120px; height: 36px; overflow: hidden; z-index: 0;">
                    <#--<input type="file" name="files" id="fileupload"
                            style="font-size: 999px; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;"
                            accept="image/jpeg,image/png,image/gif">-->
                    </div>
                </div>
            </div>
            <div class="userlogo">
                <div class="btn-sub">
                    <button class="btn" id="personBtn">保存</button>
                </div>
            </div>

            </div>
        <div class="content hide">
            <div class="hd">
                <strong>绑定设置</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>
            <div class="userpass">
                <div class="weixin">
                    <img src="http://images.mafengwo.net/images/footer/qr_mfw2.png" width="126" height="123" alt="">
                    <p class="t1">加骡窝窝为微信好友</p>
                    <p class="t2">或使用微信搜索<br>骡窝窝微信号</p>
                    <p class="t3">mafengwo2006</p>
                </div>
                <br/><br/>
                <div class="title">好东西就要与朋友们分享，97% 的蜂蜂正在将精彩内容分享给朋友们</div><br/>
                <dl class="clearfix bind-item">
                    <dt><i class="weibo"></i></dt>
                    <dd>
                        <h3>我的新浪微博账户<span>未绑定</span><br><strong>93%</strong>的蜂蜂正在分享</h3>
                        <div class="btns">
                            <a href="/setting/sns/auth/?platform=weibo" class="btn1 btn-bind">现在绑定</a>
                        </div>
                    </dd>
                </dl><br/>
                <dl class="clearfix bind-item">
                    <dt><i class="qzone"></i></dt>
                    <dd>
                        <h3>我的QQ空间账户<span>土熙</span></h3>
                        <div class="btns">
                            <a href="/setting/sns/unbind/?platform=qq" class="btn2 btn-unbind">解除绑定</a>
                        </div>
                    </dd>
                </dl>

            </div>
        </div>
        <#--账号安全-->
        <div class="content hide">
            <div class="hd">
                <strong>账号安全</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>
            <div class="userpass">
                <dl class="clearfix">
                    <dt>密码：</dt>
                    <dd>
                        <a href="javascript:;" id="set-pw-btn">修改密码</a>
                        <div id="set-pw" class="hide">
                            <div class="ways">
                                <a href="javascript:;" class="byphone"><i></i>
                                    <br/>
                                    <a href="javascript:;" id="set-pw-btn2"> 手机验证修改</a>
                                    <div id="set-pw2" class="hide">
                                        <div class="ways">
                                            <div class="form-field">
                                                <input name="password" type="password" placeholder="您的密码" id="password">
                                                <div class="err-tip"></div><br/>
                                            </div>

                                            <div class="form-field">
                                                <input name="rpassword" type="password" placeholder="修改密码" id="rpassword">
                                                <div class="err-tip"></div>
                                            </div>
                                            <br/>
                                            <div class="submit-btn">
                                                <button type="button" id="editBtn">完成修改</button>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <#--<a href="javascript:;" class="bymail disable"><i></i>
                                    <p>邮箱验证修改</p>
                                </a>-->
                            </div>
                        </div>
                    </dd>
                </dl>

                <#--<dl class="clearfix">
                    <dt>绑定邮箱：</dt>
                    <dd>
                    ${userInfo.email!}<span class="status"><a class="vertifyMail" style="margin-left: 15px;"
                                href="javascript:;">验证邮箱</a></span>
                    </dd>
                </dl>-->
                <dl class="clearfix">
                    <dt>绑定手机：</dt>
                    <dd>
                        <span id="oldphone">${userInfo.phone!}</span><span class="status"><i></i>已绑定 <a class="modifyMobile" style="margin-left: 15px;"
                                href="javascript:;">更改号码</a></span>
                    </dd>
                </dl>
                <dl class="clearfix logout">
                    <dt>账号注销：</dt>
                    <dd><a href="javascript:;" id="close">申请注销</a></dd>
                </dl>
                <ul class="logout-question">
                    <li class="_j_question"><a>注销账号有哪些影响？ </a></li>
                    <li class="_j_question"><a>注销账号的条件有哪些？ </a></li>
                    <li class="_j_question"><a>已完成商家入驻，是否可以注销？</a></li>
                    <li class="_j_question"><a>攻略号是否可以注销？</a></li>
                    <li class="_j_question"><a>手机号未绑定可以注销账号吗？</a></li>
                    <li class="_j_question"><a>绑定的手机号已更换，如何注销账号？</a></li>
                    <li class="_j_question"><a>申请了注销是否还能撤销？</a></li>
                    <li class="_j_question"><a>账号注销后，是否可以重新注册新账号？ </a></li>
                    <li class="_j_question"><a>注销账户申请的审核时间是多久？</a></li>
                </ul>
                <br><br>
            </div>
        </div>
        <#--黑名单管理-->
        <div class="content hide">
            <div class="hd">
                <strong>黑名单管理</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>
            <div class="blacklist">
                <div class="bd clearfix">
                    <dl class="col-search">
                        <dt class="s-bar focus">
                            <input id="name" class="inp-t" type="text" placeholder="输入用户昵称搜索指定用户">
                            <input id="search" class="inp-b" type="button">
                        </dt>
                        <dd>
                            <ul class="search-list">
                            </ul>
                            <div class="action"><a id="add_blacklist" class="btn" href="javascript:void(0)">加入黑名单</a>
                            </div>
                        </dd>
                    </dl>
                    <dl class="col-list">
                        <dt>我的黑名单</dt>
                        <dd>
                            <ul id="blacklist">
                            </ul>
                        </dd>
                    </dl>
                    <div class="tips">＊你将不会收到此黑名单中用户发来的私信</div>
                </div>
            </div>
        </div>
        <#--我的钱包-->
        <div class="content hide">
            <div class="hd">
                <a class="btn-payPassword"
                    href="/home/setting.php/setpaypwd?callback=%2Fsetting%2Fwallet%2F"><i></i>设置支付密码</a>
                <strong>我的钱包</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>
            <div class="userwallet">
                <div class="bd">
                    <div class="balance clearfix">
                        <div class="total">
                            <div class="honey">蜂蜜余额
                                <span><i class="icon-honey"></i><em>20</em></span>
                            </div>
                        </div>
                    </div>
                    <div class="income">
                        <div class="income_t clearfix">
                            <ul class="clearfix">
                                <li class="jq-nav-switch on" d_type="honey">
                                    蜂蜜明细
                                    <span class="bar"></span>
                                </li>
                            </ul>
                            <a href="http://www.mafengwo.cn/i/2947856.html" class="link">蜂蜜常见问题</a>
                        </div>
                        <table>
                            <thead>
                                <tr>
                                    <td>收支明细</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>2019-05-22 17:52:20</td>
                                    <td>
                                        <p title="点评－预定并入住酒店后发表点评获得奖励">点评－预定并入住酒店后发表点评获得奖励</p>
                                    </td>
                                    <td class="reward">
                                        蜂蜜：<span class="num" width="20"><em>+20</em></span></td>
                                </tr>
                            </tbody>
                        </table>
                        <div align="right" id="_j_tn_pagination" class="m-pagination">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content hide">
            <div class="hd">
                <strong>修改绑定手机</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>

            <div id="setmail" class="setmail set-mobile-v2">
                <!--setMobile step2 -->
                <div class="navtag">
                    <a class="step1 on" href="javascript:;"><i></i>身份验证</a><a class="step2"
                        href="javascript:;"><i></i>修改绑定手机</a><a class="step3" href="javascript:;"><i></i>完成修改</a>
                </div>
                <div class="set-mobile mobile-v1">
                    <div class="tips">我们将向该手机发送验证码，请在下方输入您看到的验证码</div>
                    <dl class="clearfix">
                        <dt>原手机号：</dt>
                        <dd>
                            <div class="sel-way">
                                <input type="text" id="phone" placeholder="原手机号">
                            </div>
                            <a class="btn-code vcode-send" href="#">获取验证码</a>
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>验证码：</dt>
                        <dd><input id="verifyCode" type="text" value="" placeholder="请输入验证码"></dd>
                    </dl>
                    <div class="btns">
                        <a id="id_verify" class="btn-sub " href="javascript:void(0)">提交</a>
                    </div>
                </div>
                <div class="set-mobile mobile-v2">
                    <form action="/mine/changePhone" id="phoneForm" method="post">
                    <dl class="clearfix">
                        <dt style="width:116px;">新的手机号码：</dt>
                        <dd>
                            <div class="sel-way">
                                <input name="newMobile" id="newMobile" type="text" value="" placeholder="新的手机号码">
                                <i></i>
                                <em></em>
                            </div>
                            <a id="getChangeCode" class="btn-code newvcode-send " href="#">获取验证码</a>
                            <!-- <a class="btn-code btn-code-dis" href="javascript:void(0);">已发送 60s</a> -->
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt style="width:116px;">验证码：</dt>
                        <dd><input id="newVerifyCode" name="newVerifyCode" type="text" value="" placeholder="请输入4位验证码"></dd>
                    </dl>

                    <div class="btns" style="padding-left:126px">
                        <input id="c_code" type="hidden" value="588709">
                        <a id="change_mobile" class="btn-sub" href="javascript:void(0)">提交</a>
                    </div>
                    </form>
                </div>
                <!--setMobile step2 end-->
                <div class="set-mobile mobile-v3">
                    <div style="text-align:center;color:darkgray">
                        <font size="10" face="arial" color="green">手机绑定成功</font>
                    </div>
                    <div style="text-align:center;color:darkgray">
                        <a href="/login.html"> <font size="5" face="arial" color="#adff2f">请重新登录</font></a>
                    </div>
                </div>

            </div>
        </div>
        <div class="content hide">
            <div class="hd">
                <strong>设置邮箱</strong>
                <span>
                    资料完善度
                    <div class="progress">
                        <div class="num">85%</div>
                        <div class="on" style="width:85%"></div>
                    </div>
                </span>
            </div>
            <div class="setmail">
                <!--setMail-->
                <div class="navtag">
                    <a class="step1 on" href="javascript:;"><i></i>输入邮箱</a><a class="step2"
                        href="javascript:;"><i></i>前往邮箱验证</a><a class="step3 " href="javascript:;"><i></i>完成绑定</a>
                </div>
                <div class="set-mail" id="changeEmail">
                    <dl class="clearfix">
                        <dt>新的邮箱：</dt>
                        <dd><input type="text" id="email" value=""></dd>
                    </dl>
                    <div class="tips">我们将向该邮箱发送验证邮件，点击该邮件中的链接完成验证。</div>
                    <div class="btns">
                        <a class="btn-sub" id="verify" href="javascript:;">发送验证邮件</a>
                        <a class="btn-exit" href="javascript:;">取消</a>
                    </div>
                </div>
                <div class="set-mail" id="verifyEmail" style="display: none;">
                    <p class="t1">邮件已发送到您的邮箱：<strong>etest@gmail.com</strong><a href="javascript:;"
                            id="changeBtn">修改邮箱地址</a><br>请点击邮箱中的验证链接完成验证</p>
                    <p class="go-email"><a class="btn-sub" id="resendEmail" href="javascript:;">重新发送验证邮件</a> <a
                            class="btn-sub" target="_blank" href="javascript:;">前往邮箱验证</a></p>
                    <p class="t3">没有收到邮件？</p>
                    <p class="t4">1.电子邮件偶尔会有延时状况，请耐心等待<br>2.尝试到垃圾邮件里找找看</p>
                </div>
                <!--setMail end-->
            </div>
        </div>
    </div>
    <div class="mfw-toolbar" id="_j_mfwtoolbar" style="display: block;">
        <div class="toolbar-item-top" style="display: none;">
            <a role="button" class="btn _j_gotop">
                <i class="icon_top"></i>
                <em>返回顶部</em>
            </a>
        </div>
        <div class="toolbar-item-feedback">
            <a role="button" data-japp="feedback" class="btn">
                <i class="icon_feedback"></i>
                <em>意见反馈</em>
            </a>
        </div>
        <div class="toolbar-item-code">
            <a role="button" class="btn">
                <i class="icon_code"></i>
            </a>
            <a role="button" class="mfw-code _j_code">


                <img src="https://p1-q.mafengwo.net/s1/M00/6C/51/wKgIC1t_6TuASybrAADGUPUHjr021.jpeg?imageMogr2%2Fthumbnail%2F%21450x192r%2Fgravity%2FCenter%2Fcrop%2F%21450x192%2Fquality%2F90"
                    width="450" height="192">
            </a>
            <!--<div class="wx-official-pop"><img src="http://images.mafengwo.net/images/qrcode-weixin.gif"><i class="_j_closeqrcode"></i></div>-->
        </div>

    </div>
</body>

</html>